import React, { Component } from 'react';
import { NavBar, Icon } from 'antd-mobile';
import Banner from './../../components/mudidetailbanner';
import { getBanners, getSub } from './../../api';
import style from './index.module.scss';

class Com extends Component {
    state = {
        bannerlist: [],
        sublist: []
    }

    componentDidMount() {
        getBanners().then(res => {
          this.setState({
            bannerlist: res.data.data.slideshow
          })
        })
    
        getSub().then(res => {
          this.setState({
            sublist: res.data.data
          })
        })
      }
  render() {
    return (
      <div className='box'>
          <div className="content">
            <NavBar
                mode="light"
                icon={<span className="iconfont icon-fanhui" style={{ fontSize: '0.23rem', color: '#00B145' }}></span>}
                onLeftClick={() => {
                this.props.history.go(-1)
                }}
                rightContent={[
                    <Icon key="1" type="ellipsis" style={{ color: '#00B145' }}/>,
                ]}
                >景点详情</NavBar>
                {/* 轮播图 */}
                <div className={style.banner}>
                    <Banner bannerlist={this.state.bannerlist}></Banner>
                </div>

                {/* 景点介绍 */}
                <div className={style.jingjie}>
                    <div className={style.lvtitle}>冰岛</div>
                    <div className={style.zi}>冰岛共和国（冰岛语：Lýðveldið Ísland），是北大西洋中的一个岛国。北欧五国之一，国土面积为10.3万平方千米，人口约为34万，是欧洲人口密度最小的国家。首都是雷克雅未克，也是冰岛的最大城市。地处大西洋中脊上，多火山、地质活动频繁，内陆主要是平原地貌，境内多分布沙质地、冷却的熔岩平原和冰川。</div>
                </div>

                <div className={style.city}>
                    <div className={style.meishi}>
                        <span className={style.no1}>冰岛美食</span>
                        <span className={style.no2}>查看更多</span>
                    </div>

                    <ul>
                        <li>
                            <img src="/images/detail/chakangenduo@2x.png" alt=""/>
                            <div className={style.right}>
                                <p>发酵鲨鱼肉：重口味的冰岛国菜 </p>
                                <p style={{height: '0.4rem'}}>由于鲨鱼是没有所谓的尿道，所以尿液全部发散在血管里。取鲨鱼腹部的肉，经由土埋发酵，然后再经过大约4～5个月风干而成。 冰岛人主要在每年一月中开始祭祀雷神的丑食节(Þorrablót)会食用这种“冰岛特色”食物。</p>
                            </div>
                        </li>
                    </ul>
                </div>

                {/* 相册 */}
                <div className={style.ce}>
                        <div className={style.meishi}>
                            <span className={style.no1}>冰岛美食</span>
                            <span className={style.no2}>查看更多</span>
                        </div>
                        <div className={style.xia}>
                            <img src="/images/detail/img1@2x.png" alt=""/>
                            <img src="/images/detail/img1@2x.png" alt=""/>
                            <img src="/images/detail/img1@2x.png" alt=""/>
                            <img src="/images/detail/img1@2x.png" alt=""/>
                            <img src="/images/detail/img1@2x.png" alt=""/>
                        </div>
                </div>
          </div>
          
      </div>
    );
  }
}

export default Com